<template>
  <div>
    <div class="scrollDiv">
      <scroller>
        <div class="main">
          <div class="header">
            <div class="header_img"><img :src="questionObj.avatar"></div>
            <div class="header_title">
              <div class="title_1">
                <h3>{{ questionObj.name + ' ' + questionObj.title}}</h3>
                <p>{{ questionObj.createtime ? (new Date(questionObj.createtime)).format('yyyy-MM-dd hh:mm')  : '' }}</p>
              </div>
            </div>
          </div>
          <div class="content">{{ questionObj.text }}</div>
        </div>
        <div style="width: 7.5rem;height: 1.5rem;"></div>
      </scroller>
      <downLoad :hasShare="hasShare"></downLoad>
    </div>
  </div>  
</template>

<script>
  import downLoad from './../components/common/download/downLoad.vue'
  import { format	} from './../utils/filter'
  
  export default {
    components: {
      downLoad,
    },
    mounted() {
      this.questionObj = this.$route.query.type;
    },
    data() {
      return {
        questionObj: {},
        hasShare: true,
      }
    },
  }
</script>

<style lang="scss" scoped>
  @import "../styles/mixin.scss";
  .scrollDiv {
    width: 100%;
    height: 100vh;
  }
  .main {
    background-color: #FFF;
    padding: px2rem(30);
    min-height: 100vh;
    .header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: px2rem(30);
      .header_img {
        width: 15%;
        text-align: center;
        img {
          width: px2rem(90);
          border-radius: 50%;
        }
      }
      .header_title {
        width: 85%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        .title_1 {
          font-size: px2rem(32);
          p {
            font-size: px2rem(25);
            color: #727272;
            margin-top: px2rem(10);
          }
        }
      }
    }
    .content {
      color: #666;
      font-size: px2rem(30);
      line-height: px2rem(45);
    }
  }
</style>
